@border-color: #efefef;
@todo-text-color: #34373d;

:host { // 对宿主元素
  width: 100%;
}

.main {
  background-color: white;

  nz-header {
    position: relative;
    background-color: lightcoral;
    height: 180px;
    padding: 0 10px;

    .title {
      position: absolute;
      bottom: 57px;
      font-size: 37px;
      color: white;
      font-weight: lighter;
      padding: 0 10px;
      cursor: default;
    }

    .date {
      position: absolute;
      bottom: 15px;
      font-size: 20px;
      color: white;
      font-weight: lighter;
      padding: 0 10px;
      cursor: default;
    }
  }

  nz-content {
    padding: 0 10px;

    .todo {
      height: 48px;
      line-height: 48px;
      border-bottom: 1px solid @border-color;

      i {
        display: inline-block;
        background: url("../../assets/imgs/check_default.png") no-repeat;
        height: 24px;
        width: 24px;
        vertical-align: middle;
        cursor: pointer;
        margin: 0 5px 0 10px;

        &:hover {
          background: url("../../assets/imgs/check_hover.png") no-repeat;
        }
      }

      .todo-text {
        font-size: 15px;
        vertical-align: middle;
        color: @todo-text-color;
      }

      &:hover {
        background: whitesmoke;
      }
    }
  }
}
